<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>classnames</title>
</head>

<body>
    <div>打开控制台查看结果</div>
    <script>
        const classnames = (...args) => {
            const classes = [];
            for (let i = 0, len = args.length; i < len; i++) {
                const cls = args[i];
                if (!cls) {
                    continue;
                }
                if (typeof cls === 'string' || typeof cls === 'number') {
                    classes.push(cls);
                } else if (Array.isArray(cls)) {
                    if (cls.length) {
                        const _class = classnames.apply(null, cls);
                        _class && classes.push(_class);
                    }
                } else {
                    if (Object.prototype.toString === cls.toString) {
                        for (let key in cls) {
                            if (Object.prototype.hasOwnProperty.call(cls, key) && cls[key]) {
                                classes.push(key);
                            }
                        }
                    } else {
                        classes.push(cls.toString());
                    }
                }
            }
            return classes.join(' ');
        };
        console.log(classnames({ test: true, 'test-2': false, 'test-3': true }));; // 'test test-2 test-3';
        console.log(classnames(['test-1', { test: true }]));; // 'test-1 test';
        console.log(classnames('test-1', 'test-2', 3));; // 'test-1 test-2 3';
    </script>
</body>

</html>